<template>
  <div class="learning-news">
    <content-header title="学习资讯"></content-header>
    <div class="list-wrap xui-padding-bottom-lg">
      <div v-for="(item,index) in listData"  :key="index" >
        <img-text-list  :item="item" :href='`news/detail/${item.nId}`'></img-text-list>
      </div>
    </div>
    <!-- 分页组件 -->
    <el-pagination
      background
      v-if="page.count > page.size"
      layout="prev, pager, next"
      :total="page.count"
      class="xui-margin-top xui-text-center"
      :current-page.sync="page.index"
      @current-change="getNews"
      :page-size="page.size">
    </el-pagination>
  </div>
</template>
<script>
import ContentHeader from "@/components/widge/content-header";
import imgTextList from "@/components/list/img-text-list";
import { getlearningDetail, getlearningNews } from "@/api/learning-guide";

export default {
  components: {
    imgTextList,
    ContentHeader
  },
  data() {
    return {
      page: {
        index: 1,
        count: 0,
        size: 10
      },
      listData: []
    };
  },
  methods: {
    getNews() {
      getlearningNews(this.page.index, this.page.size).then(res => {
        this.listData = res.data.recordsList;
        this.page.count = res.data.count;
      });
    }
  },
  mounted() {
    this.getNews();
  }
};
</script>

